<template>
  <el-card class="box-card">
    <template #header>
      <el-form :inline="true" :model="formInline" class="demo-form-inline">
        <el-form-item label="盘点单号">
          <el-input v-model="formInline.inventoryNo" placeholder="请输入盘点单号" clearable />
        </el-form-item>
        <el-form-item label="供应商">
          <selectSupplier v-model="formInline.supplierSn" val="supplierSn"></selectSupplier>
        </el-form-item>
        <el-form-item label="状态">
          <el-select v-model="formInline.status" placeholder="请选择状态">
            <el-option v-for="item in counter.inventoryStatus" :key="item.value" :label="item.name" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="search">查找</el-button>
          <el-button @click="init">重置</el-button>
        </el-form-item>
      </el-form>
    </template>
    <el-table :data="tableParams.rows" style="width: 100%">
      <el-table-column prop="inventoryNo" label="盘点单号" align="center">
        <template #default="scope">
          <el-button type="primary" text @click="toDetails(scope.row)">{{scope.row.inventoryNo}}</el-button>
        </template>
      </el-table-column>
      <el-table-column prop="planNo" label="关联计划单" />
      <el-table-column label="状态">
        <template #default="scope">
          {{counter.idString_format("inventoryStatus",scope.row.status)}}
        </template>
      </el-table-column>
      <el-table-column prop="address" label="供应商">
        <template #default="scope">
          <selectSupplier v-model="scope.row.supplierSn" val="supplierSn" readonly="1"></selectSupplier>
        </template>
      </el-table-column>
      <el-table-column prop="address" label="工厂">
        <template #default="scope">
          <selectFactory v-model="scope.row.factoryId" readonly="1"></selectFactory>
        </template>
      </el-table-column>
      <el-table-column prop="address" label="仓库">
        <template #default="scope">
          <selectStores v-model="scope.row.storeId" readonly="1"></selectStores>
        </template>
      </el-table-column>
      <el-table-column label="库区">
        <template #default="scope">
          <selectStoreRegion v-model="scope.row.storeRegionId" readonly="1"></selectStoreRegion>
        </template>
      </el-table-column>
      <el-table-column label="库位">
        <template #default="scope">
          <selectStoreLocation v-model="scope.row.storeRegionLocationId" readonly="1"></selectStoreLocation>
        </template>
      </el-table-column>
    </el-table>
    <Pagination v-if="tableParams['total']" :total="tableParams['total']" v-model:page="formInline.pageNum" v-model:limit="formInline.pageSize" @pagination="getInfo" />
  </el-card>
</template>

<script setup lang="ts">
import { onMounted } from "vue";
import useCounterStore from "@/store/counter";
const counter = useCounterStore();
const { proxy } = getCurrentInstance();
let formInline = ref({
  pageNum: 1,
  pageSize: 10,
  inventoryNo: "",
  supplierSn: "",
  status: "",
});
let tableParams = ref({});

onMounted(() => {
  search();
});

let search = () => {
  formInline.value.pageNum = 1;
  getInfo();
};
let getInfo = async () => {
  tableParams.value = await proxy.$apis.inventoryRecordList(formInline.value);
  console.log("盘点任务", tableParams.value.rows);
};
let init = () => {
  formInline.value = {
    pageNum: 1,
    pageSize: 10,
    inventoryNo: "",
    supplierSn: "",
    status: "",
  };
  getInfo();
};
let toDetails = (row) => {
  proxy.$utils.toLink(`/inventory/inventoryRecordDetails?id=${row.id}`);
};
</script>

<style lang="scss" scoped>
.box-card {
  margin: 20px;
}
</style>
